<!--
 * @Date: 2023-02-09 16:58:23
 * @LastEditTime: 2023-03-16 15:54:31
 * @FilePath: /hash-guess-game/src/views/hashRaceCourse/hashRaceCourse.vue
 * 介绍:哈希赛池
-->
<script lang="ts" setup>
import { showDialog } from "vant";
import { formatNumber } from "@@/utils/tools/tools";
import useBalanceStore from "@@/store/useBalanceStore";
import {
  apiShareCard,
  ShareCard,
  apiUnShareCard,
} from "@@/api/module/hashRaceCourse";
import { apiBuyShareCard } from "@@/api/module/transfer";
import { sdkAutoTransfer } from "@@/sdk/solana";
import { apiHomeData } from "@@/api/module/home";
import toast from "@@/components/rework/toast";
import router from "@@/router";

const { t } = useI18n();

const balanceStore = useBalanceStore();

//************添加************
const addFrom = reactive({
  amount: "",
});
const hashCoin = computed(() => balanceStore.getByCode("HASH"));
balanceStore.getBalance(hashCoin.value?.index);

async function onAddBtn() {
  const amount = Number(addFrom.amount);
  toast.loading();
  const balance = await balanceStore.getBalance(hashCoin.value?.index);
  toast.close();
  if (!(amount > 0))
    return toast.text(
      `${t("bu-neng-xiao-yu")} : ${0}${hashCoin.value?.name || ""}`
    );
  if (!(amount <= balance!)) return toast.text(t("yu-e-bu-zu"));
  toast.loading();
  const res = await apiHomeData();
  toast.close();
  if (!res || !res.share_address) return toast.error(t("shi-bai"));
  const share_multiple = Number(res.share_multiple);
  if (amount % share_multiple != 0)
    return toast.text(`${t("qing-shu-ru-ta-de-bei-shu")} :${share_multiple}`);
  buyShare(hashCoin.value!, amount, res.share_address);
}
/**购买分享卡 */
async function buyShare(
  coin: NonNullable<typeof hashCoin.value>,
  number: number,
  address: string
) {
  const res = await sdkAutoTransfer(
    coin.contract_addr,
    number,
    coin.format,
    address
  );
  if (!res.status) return toast.text(res.message);
  apiBuyShareCard({ txid: res.data!, number });
}

//************解除************
const subFrom = reactive({
  amount: "",
});
const shareCard = reactive<ShareCard.Res | unknownObj>({});
getShareCard();
/**获取分享卡信息 */
async function getShareCard() {
  const res = await apiShareCard();
  if (!res) return;
  Object.assign(shareCard, res);
}
function onSubBtn() {
  const amount = Number(subFrom.amount);
  if (!(amount > 0)) return toast.text(`${t("bu-neng-xiao-yu")} : ${0}`);
  if (!(amount <= shareCard.cards!))
    return toast.text(t("fen-xiang-ka-shu-liang-bu-zu"));
  showDialog({
    title: t("qing-que-ren"),
    message: `${t("qu-xiao-fen-xiang-ka")} :${amount}`,
  }).then(() => unShareCard(amount));
}
async function unShareCard(number: number) {
  if (await apiUnShareCard({ number })) router.back();
}
</script>

<template>
  <div class="hashRaceCourse auto-mt-md">
    <h4 class="T-A-C">{{ $t("ha-xi-sai-chi-0") }}</h4>
    <Tabs type="card" :shrink="false">
      <!-- 添加 -->
      <VanTab class="mt-md" :title="$t('tian-jia')">
        <Card :gap-text="$t('yu-e')">
          <template #header> <div></div></template>
          <div class="auto-mt-md">
            <h3 class="T-A-C C-M2">
              {{ formatNumber(hashCoin?.balance) }}
            </h3>
            <div class="color-box">
              <div class="T-S-sm">{{ $t("shu-liang") }}</div>
              <VanField
                v-model="addFrom.amount"
                type="number"
                :placeholder="$t('qing-shu-ru-ha-xi-shu-liang')"
              >
              </VanField>
            </div>
            <VanButton @click="onAddBtn" :type="'primary'" block>
              {{ $t("que-ren-tian-jia") }}
            </VanButton>
          </div>
          <div
            @click="$router.push({ name: 'shareCardList' })"
            class="T-A-R T-S-sm active mt-sm"
          >
            {{ $t("tian-jia-ji-lu") }}
          </div>
        </Card>
      </VanTab>
      <!-- 解除 -->
      <VanTab class="mt-md" :title="$t('jie-chu')">
        <Card :gap-text="`HASH${$t('fen-xiang-ka') || ''}`">
          <template #header> <div></div></template>
          <div class="auto-mt-md">
            <h3 class="T-A-C C-M2">
              {{ formatNumber(shareCard.cards) }}
            </h3>
            <div class="color-box">
              <div class="T-S-sm">{{ $t("shu-liang") }}</div>
              <VanField
                v-model="subFrom.amount"
                type="number"
                :placeholder="$t('qing-shu-ru-zhang-shu')"
              >
              </VanField>
            </div>
            <VanButton @click="onSubBtn" :type="'primary'" block>{{
              $t("que-ren-jie-chu")
            }}</VanButton>
          </div>
          <div
            @click="$router.push({ name: 'shareCardList' })"
            class="T-A-R T-S-sm active mt-sm"
          >
            {{ $t("jie-chu-ji-lu") }}
          </div>
        </Card>
      </VanTab>
    </Tabs>
  </div>
</template>

<style lang="less" scoped>
.color-box {
  border-bottom: 1rem solid var(--C-O5);
}
</style>
